import { useState ,useEffect} from 'react'

import TestA from "./components/testa"
import TestB from "./components/testb"
import TestC from "./components/testEffect"
import MyComponent  from './components/mycontext/use'
import MyJquery from "./components/myjquery"
import TextInputWithFocusButton from "./components/testRef"
import * as algo from "./components/algorium"
import './App.css'
import MyWebGl from "./components/mywebglb"
 import MyWebGljs from "./components/MyWebGljs"
import TexturePoint from "./components/mygl/TexturePoint.jsx"
 import Cut from "./components/mygl/Cut.jsx"

function App() {
  const [count, setCount] = useState(0)
  useEffect(()=>{
    algo.main();
  },[])

  return (
    <div>
      
      <h1>  React redux vite vtk vti threejs ts</h1>
      <TexturePoint />
      <MyWebGljs />
      <MyWebGl />
      <TestA />
      <TestB />
      <TestC />
      <MyJquery />
      <MyComponent />
      <TextInputWithFocusButton />
     <Cut />
      <div className="card">
        <button onClick={() => setCount((count) => count + 1)}>
          count is {count}
        </button>
        <p>
          Edit  
        </p>
      </div>
      <p className="read-the-docs">
        Click  
      </p>
    </div>
  )
}

export default App
